﻿@{

    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Demo</title>
    <!-- 请勿在项目正式环境中引用该 layui.css 地址 -->
    <link href="//unpkg.com/layui@2.9.17/dist/css/layui.css" rel="stylesheet">
</head>
<body>
    <form class="layui-form layui-row layui-col-space16">
        <div class="layui-input-inline layui-input-wrap">
            <input type="text" name="workstationCode" value="" placeholder="工作站编码" class="layui-input" lay-affix="clear" width="50">
        </div>
        <div class="layui-input-inline layui-input-wrap">
            <div class="layui-input-wrap">
                <input type="text" name="workstationName" placeholder="工作站名称" lay-affix="clear" class="layui-input" width="50">
            </div>
        </div>
        <div class="layui-input-inline layui-input-wrap">
            <label class="layui-form-label">所在车间</label>
            <div class="layui-input-inline">
                <select name="workshopID">
                    <option value="0">请选择问题</option>
                </select>
            </div>
        </div>
        <div class="layui-input-inline layui-input-wrap">
            <label class="layui-form-label">所属工序</label>
            <div class="layui-input-inline">
                <select name="processID">
                    <option value="0">请选择问题</option>
                </select>
            </div>
        </div>

        <div class="layui-input-inline layui-input-wrap">
            <button class="layui-btn" lay-submit lay-filter="demo-table-search">搜索</button>
            <button type="button" class="layui-btn layui-btn-primary" lay-on="test-page-custom">
                <span></span> 添加
            </button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </form>
    <table class="layui-hide" id="ID-table-demo-search"></table>

    <!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
    <script src="//unpkg.com/layui@2.9.17/dist/layui.js"></script>
    <script src="~/Scripts/jquery-3.4.1.min.js"></script>
    <script type="text/html" id="toolDemo">
        <div class="layui-clear-space">
          <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
          <a class="layui-btn layui-btn-xs" lay-event="more">删除</a>
        </div>
    </script>
    <script>
        layui.use(function () {

            var table = layui.table;
            var form = layui.form;
            var laydate = layui.laydate;
            // 创建表格实例
            table.render({
                elem: '#ID-table-demo-search',
                url: '/api/app/work-station/work-station-list', // 此处为静态模拟数据，实际使用时需换成真实接口
                cols: [[

                    { field: 'workstationCode', fixed: 'left', title: '工作站编号', sort: true, totalRow: '合计：' },
                    { field: 'workstationName', title: '工作站名称' },
                    { field: 'workstationAddress', title: '工作站地点' },
                    { field: 'workshopName', title: '所在车间名称' },
                    { field: 'processName', width: 100, title: '所属工序', sort: true },
                    { field: 'enableFlag', title: '是否启用', },
                    { field: 'remark', title: '备注', sort: true, totalRow: '{{= d.TOTAL_NUMS }} 😊' },

                    { fixed: 'right', title: '操作', width: 134, minWidth: 125, templet: '#toolDemo' }
                ]],
                page: {
                    limit: 2,
                    limits: [2, 20, 30, 50, 100],
                    prev: '上一页',
                    next: '下一页',
                    first: '首页',
                    last: '尾页'
                },
                request: {
                    pageName: 'pageIndex',
                    limitName: 'pageSize'
                },
                parseData: function (res) {
                    console.log(res)
                    console.log(res.data)
                    return {
                        "code": res.code, //解析接口状态
                        "count": res.count, //解析数据长度
                        "data": res.data//解析数据列表
                    };
                    
                },
                height: 510
            });
            // 日期
            laydate.render({
                elem: '.demo-table-search-date'
            });
            // 搜索提交
            form.on('submit(demo-table-search)', function (data) {
                var field = data.field; // 获得表单字段
                console.log(field)
                // 执行搜索重载
                table.reload('ID-table-demo-search', {
                    page: {
                        curr: 1 // 重新从第 1 页开始
                    },
                    where: {
                        workstationCode: field.workstationCode,
                        workstationName: field.workstationName,
                        workshopID: field.workshopID,
                        processID: field.processID

                    } // 搜索的字段
                });
                layer.msg('搜索成功<br>此处为静态模拟数据，实际使用时换成真实接口即可');
                return false; // 阻止默认 form 跳转
            });
            //动态绑定·车间·下拉框
            $(document).ready(function () {
                $.ajax({
                    url: "/api/app/work-station/work-shop-list",
                    type: "get",
                    dataType: "json",
                    success: function (data) {
                        var options = "";
                        $.each(data, function (index, item) {
                            options += "<option value='" + item.id + "'>" + item.workshopName + "</option>";
                        });
                        $("select[name='workshopID']").append(options);
                        form.render('select')
                        console.log(data.data)
                    }
                })
            });
            //动态绑定·工序·下拉框
            $(document).ready(function () {
                $.ajax({
                    url: "/api/app/work-station/process-list",
                    type: "get",
                    dataType: "json",
                    success: function (data) { 
                        var options = "";
                        $.each(data.data, function (index, item) {
                            options += "<option value='" + item.Id + "'>" + item.ProcessName + "</option>";
                        });
                        $("select[name='processID']").append(options);
                        form.render('select')
                        console.log(data.data)
                    }
                })
            });
        });
    </script>
    @* 添加 *@
    <script>
        layui.use(function () {
            var $ = layui.$;
            var layer = layui.layer;
            var util = layui.util;
            var form = layui.form;
            var table = layui.table;
            var laydate = layui.laydate;
            var laypage = layui.laypage;
            // 事件
            util.on('lay-on', {

                'test-page-custom': function () {
                    layer.open({
                        type: 2, // page 层类型
                        area: ['500px', '500px'],
                        title: '添加工作站',
                        shade: 0.6, // 遮罩透明度
                        shadeClose: true, // 点击遮罩区域，关闭弹层
                        maxmin: true, // 允许全屏最小化
                        anim: 0, // 0-6 的动画形式，-1 不开启
                        content: "/Li/WorkStationAdd",
                        end: function () {
                            window.location.href = "/MainData/WorkStation/";
                        }
                    });
                }
            });
            // 事件
            //表单操作
            table.on('tool(ID-table-demo-search)', function (obj) {

                if (obj.event === 'edit') {
                    var data = obj.data;
                    var ytiu = data;
                    console.log(obj.data);
                    workstationCode = data.workstationCode;
                    workstationName = data.workstationName;
                    workstationAddress = data.workstationAddress;
                    workshopID = data.workshopID;
                    processID = data.processID;
                    enableFlag = data.enableFlag;
                    remark = data.remark;
                    createBy= data.createBy;
                        createTime=data.createTime;
                    id = data.id;
                    layer.open({
                        type: 2, // page 层类型
                        area: ['500px', '500px'],
                        title: '修改工作站',
                        shade: 0.6, // 遮罩透明度
                        shadeClose: true, // 点击遮罩区域，关闭弹层
                        maxmin: true, // 允许全屏最小化
                        anim: 0, // 0-6 的动画形式，-1 不开启
                        content: "/Li/WorkStationUpdate",
                        end: function () {
                            window.location.href = "/MainData/WorkStation/";
                        }
                    });
                }

                else if (obj.event === 'more') {
                    if (!confirm('确定删除吗？')) return;
                    $.ajax({
                        url: '/Li/DeleteWorkStation', // 替换为你的API URL
                        type: 'GET',
                        data: { id: obj.data.id },
                        dataType: 'json',
                        success: function (res) {
                            if (res != null) {
                                alert("删除成功");
                                window.location.href = "/MainData/WorkStation/";
                            }
                        }
                    });
                }
            })
        });
    </script>


</body>
</html>
